<template>
  <div class="home">
    <div class="header">
      <div class="logo">
        <img src="../../assets/img/home/logo.png" alt="">
      </div>
      <div class="title">
        <img src="../../assets/img/service/service-title.png" alt="">
      </div>
    </div>

    <div class="btn-group">
      <grid :cols="3">
        <grid-item v-for="(value,i) in btnLinks" :key="i"  class="btn-box" :link="{path:value.link}">
          <span>
            <img :src="value.url" alt="">
          </span>
          <span>{{i}}</span>
        </grid-item>
      </grid>
    </div>

  </div>
</template>

<script>
  import { Grid, GridItem } from 'vux'

  export default {
    components: {
      Grid,
      GridItem
    },
    data () {
      return {
        btnLinks: {
          无人机撒药: { url: require('../../assets/img/service/service-01.png'), link: '' },
          催芽育苗: { url: require('../../assets/img/service/service-02.png'), link: '' },
          医药专区: { url: require('../../assets/img/service/service-03.png'), link: '' },
          婚纱照专区: { url: require('../../assets/img/service/service-04.png'), link: '' },
          电脑维修: { url: require('../../assets/img/service/service-05.png'), link: '/service/dnwx' },
          拼团团购: { url: require('../../assets/img/service/service-06.png'), link: '/service/pttg' },
          年货专区: { url: require('../../assets/img/service/service-07.png'), link: '/service/nhzq' }
        }
      }
    }
  }
</script>

<style lang="less">

</style>


